<template>
  <div style="cursor: pointer">
    <el-tag :type="type" @click.native="handleClick">{{ text }}</el-tag>
  </div>
</template>

<script>
import { setCommodity } from "@/api/goods/index";

export default {
  props: {
    value: {
      require: true
    },
    // 本行的所有数据，此字段不需要额外配置
    scope: {
      default: null
    },
  },
  computed: {
    type () {
      return this.value == 0 ? 'success' : 'danger'
    },
    text () {
      return this.value == 0 ? '上架' : '下架'
    }
  },
  methods: {
    // 下架 上架
    handleClick () {
      console.log(this.scope.row.id)
      let params = {
          id: this.scope.row.id,
          status: this.value == 0 ? '1' : '0'
      }
      this.$confirm(`此操作将${this.text}商品, 是否继续?`, "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          setCommodity(params)
            .then(res => {
              if (res.success) {
                this.$message({
                  message: "下架成功",
                  type: "success"
                });
                this.$emit('input', !this.value)
              }
            })
            .catch(err => {
              this.$message.error(err);
            });
        })
        .catch(err => {
        });
    }
  }
}
</script>